/**
 * ################
 * #######河道######
 * ################
 */
import RiverHistoryData from './../../../page/common/ChartHistoryData'
// import RealTimeInstrument from './../../../page/river/RealTimeInstrument'
import DataList from './../../../page/common/DataList'
import DateDataLineChart from './../../../page/common/DateDataLineChart'
// import PictureView from './../../../page/common/PictureView'
import {pointFeatureStyle, initCenter} from './../../common'
import point from '../../../map/vuex/point'
import glint from '../../../map/vuex/glint'
import Vue from 'vue'
const river = {
  // 该配置描述描点ID
  id: 'river',
  // 名称
  name: '河段', // 河道
  // 应该使用的图标
  icon: '/static/icon/hedao-01.png',
  // 应该使用的图标（矢量）
  'icon-svg': '/static/svg/hedao-01.svg',
  // 应该使用的图标-激活
  iconH: '/static/icon/hedao-H-01.png.png',
  // 是否显示（初始化时是否隐藏）
  isShow: false,
  // 主键
  primaryKey: 'STCD',
  /**
   * 事件回调函数
   * @param eventName 触发事件名称
   * @param param 传递参数
   */
  triggeCallback: function (eventName, isShow, features) {
    // 当事件为图层可见状态发生变化时
    if (eventName === 'layer-visible-change') {
      const {$vuexStore: vuex} = Vue.prototype
      if (isShow) {
        vuex.dispatch('setView', initCenter)
      }
      if (!isShow) {
        features = null
        glint.state.points = []
      }
      if (features != null) {
        for (let i in features) {
          let FOLE = features[i].get('fole')
          let ALLE = features[i].get('alle')
          let GULE = features[i].get('gule')
          let LE = features[i].get('le')
          if (LE > FOLE && FOLE != null) {
            glint.state.points.push(features[i])
            continue
          } else if (LE > ALLE && ALLE != null) {
            glint.state.points.push(features[i])
            continue
          } else if (LE > GULE && GULE != null) {
            glint.state.points.push(features[i])
            continue
          }
        }
      }

      point.points(isShow, glint.state.points)
    }
  },
  // 做为要素在地图上显示的样式
  featureStyle: function (feature, resolution) {
    let les = ''
    if (feature.get('le') === '0') {
      les = '0米'
    } else if (typeof (feature.get('le')) !== 'undefined') {
      les = feature.get('le') + '米'
    }
    return pointFeatureStyle(
      '/static/icon/hedao-01.png',
      feature.get('stnm') + ' ' + les,
      feature,
      resolution
    )
  },
  // 做为要素在地图上被激活的样式
  featureStyle_H: function (feature, resolution) {
    let les = ''
    if (feature.get('le') === '0') {
      les = '0米'
    } else if (typeof (feature.get('le')) !== 'undefined') {
      les = feature.get('le') + '米'
    }
    return pointFeatureStyle(
      '/static/icon/hedao-H-01.png',
      feature.get('stnm') + ' ' + les,
      feature,
      resolution
    )
  },
  // 地图描点数据来源（使用缓存）http://172.16.238.24:8080/dataservice/api/service/sewageplant/SewagePlantLive
  src: `/ssjc/River/RiverLive?name=''&isGeo_=true&typeKey_=river&longitudeKey_=lng&latitudeKey_=lat`,
  // 列表数据来源http://172.16.238.24:8080/dataservice/api/service/sewageplant/SewagePlantLivePage
  tableSrc: `/ssjc/River/RiverLivePage`,
  // 列表查询数据来源 http://172.16.238.24:8080/dataservice/api/service/sewageplant/SewagePlantLiveVagueQuery
  tableQuerySrc: '/ssjc/River/RiverLiveQuery',
  // 详情标签页
  detailTabs: {
    /**
     * 站点信息
     */
    // baseInfo: {
    //   // 名称
    //   name: '即时监测',
    //   // 组件
    //   component: RealTimeInstrument,
    //   // 该组件需要的数据接口
    //   src: {
    //     // 根据主键获取单条数据
    //     detail: '/ssjc/River/RiverLiveQueryByStcd'
    //   },
    //   // 附加数据
    //   addition: {
    //     // 展示数据的键
    //     showKey: 'LE'
    //   }
    // },
    /** 实时数据 */
    dataList: {
      // 名称
      name: '当天数据',
      // 组件
      component: DataList,
      // 该组件需要的数据接口--按照时间范围查询历史数据
      src: {
        url: '/ssjc/River/RiverHistorys',
        param: ({row, date}) => {
          let now = typeof date === 'string' ? new Date(date) : new Date()
          let dateStr = now.getFullYear() + '-' + (now.getMonth() + 1) + '-' + now.getDate()
          let stcd = ''
          if (row['STCD']) {
            stcd = row['STCD']
          } else {
            stcd = row['stcd']
          }
          return {
            STCD: stcd,
            BEGINDATE: dateStr + ' 00:00:00',
            // 结束日期1天前
            ENDDATE: dateStr + ' 23:59:59'
          }
        }
      },
      // 附加数据
      addition: {
        // 展示数据的键
        tableFormat: [
          {
            // 显示标题
            label: '站名',
            // 属性键
            prop: 'STNM',
            // 是否需要搜索
            isSearch: true,
            // 格式化函数
            formatter: function (row, column, cellValue, index) {
              return cellValue
            }
          },
          // 时间
          {
            label: '监测时间',
            prop: 'YMDHM',
            // width: 200,
            isSearch: true,
            formatter: function (row, column, cellValue, index) {
              if (cellValue) {
                // 'q+': Math.floor((date.getMonth() + 3) / 3), //季度yyyy-MM-dd hh:mm:ss
                return new Date(cellValue).format('yyyy-MM-dd hh:mm:ss')
              }
              return ''
            }
          },
          // 瞬时流速
          {
            label: '实时水位',
            prop: 'LE',
            // width: 200,
            isSearch: true,
            formatter: function (row, column, cellValue, index) {
              return cellValue
            }
          },
          // 水势
          {
            label: '水势',
            prop: 'WAPO',
            width: 100,
            isSearch: true,
            formatter: function (row, column, cellValue, index) {
              if (row.WAPO === '6') {
                return `<img style='width:20px;' src='/static/img/flat.svg'></img>`// 平
              } else if (row.WAPO === '5') {
                return `<img style='width:20px;' src='/static/img/down.svg'></img>`// 降
              } else if (row.WAPO === '4') {
                return `<img style='width:20px;' src='/static/img/up.svg'></img>`// 涨
              }
              return `--`
            }
          }
        ]
      }
    },
    /**
     * 监测图片
     */
    // picture: {
    //   // 名称
    //   name: '监测图片',
    //   // 组件
    //   component: PictureView,
    //   // 该组件需要的数据接口
    //   src: {
    //     // 图片服务：http://172.16.238.24:8080/dataservice/api/service/Picture/PictureHistoryDate
    //     url: '/ssjc/Picture/PictureHistoryDate',
    //     param: ({row, date}) => {
    //       let dateStr = ''
    //       let stcd = ''
    //       if (row['STCD']) {
    //         stcd = row['STCD']
    //       } else {
    //         stcd = row['stcd']
    //       }
    //       if (date !== '' && date !== undefined) {
    //         dateStr = date
    //       } else {
    //         let now = new Date()
    //         dateStr = now.getFullYear() + '-' + (now.getMonth() + 1) + '-' + now.getDate()
    //       }
    //       return {
    //         STCD: stcd,
    //         BEGINDATE: dateStr + ' 00:00:00',
    //         // 结束日期1天前
    //         ENDDATE: dateStr + ' 23:59:59'
    //       }
    //     }
    //   },
    //   // 附加数据
    //   addition: {
    //     // 展示数据的键
    //     primaryKey: 'STCD'
    //   }
    // },
    dataLineChart: {
      // 名称
      name: '实时图表',
      // 组件
      component: DateDataLineChart,
      // 该组件需要的数据接口--按照时间范围查询历史数据
      src: {
        url: '/ssjc/River/RiverHistory',
        param: ({row, date}) => {
          let now = typeof date === 'string' ? new Date(date) : new Date()
          let dateStr = now.getFullYear() + '-' + (now.getMonth() + 1) + '-' + now.getDate()
          let stcd = ''
          if (row['STCD']) {
            stcd = row['STCD']
          } else {
            stcd = row['stcd']
          }
          return {
            STCD: stcd,
            BEGINDATE: dateStr + ' 00:00:00',
            // 结束日期1天前
            ENDDATE: dateStr + ' 23:59:59'
          }
        }
      },
      // 附加数据
      addition: {
        // 主键
        primaryKey: 'STCD',
        // 展示数据的键
        showKey: 'LE',
        // 时间的键
        dateKey: 'YMDHM',
        // 展示数据的键
        chartShowKey: 'LE',
        // 时间的键
        chartDateKey: 'YMDHM'
      }
    },

    /**
     * 历史信息
     */
    history: {
      // 名称
      name: '历史数据',
      // 组件
      component: RiverHistoryData,
      // 该组件需要的数据接口
      src: {
        // 按年查询日历史数据（天单位）
        yearQuery: {
          url: '/ssjc/River/RiverLiveYearQuery',
          param: ({
            // 当前处理站数据
            row,
            // 选中年
            choseYear,
            // 时间范围
            dateScope}) => {
            let stcd = ''
            if (row['STCD']) {
              stcd = row['STCD']
            } else {
              stcd = row['stcd']
            }
            return 'STCD=' + stcd + '&YEAR=' + choseYear
          }
        },
        // 按照日期范围查询日历史数据（天单位）
        dateScope: {
          url: '/ssjc/River/RiverLiveDateQuery',
          param: ({
            // 当前处理站数据
            row,
            // 选中年
            choseYear,
            // 时间范围
            dateScope,
            // 查询类型：1为年查询
            type}) => {
            let stcd = ''
            if (row['STCD']) {
              stcd = row['STCD']
            } else {
              stcd = row['stcd']
            }
            return 'STCD=' +
              stcd +
              '&BEGINDATE=' +
              dateScope[0].format('yyyy-MM-dd hh:mm:ss') +
              '&ENDDATE=' +
              dateScope[1].format('yyyy-MM-dd hh:mm:ss')
          }
        },
        // 按照时间范围查询历史数据
        timeScope: {
          url: '/ssjc/River/RiverHistory',
          param ({date, Stcd}) {
            return {
              STCD: Stcd,
              BEGINDATE: date + ' 00:00:00',
              ENDDATE: date + ' 23:59:59'
            }
          }
        }
      },
      // 附加数据
      addition: {
        // 给历史页面做导出时的标题
        stationName: '站名',
        // 给历史页面做导出时的属性名
        charStationName: 'STNM',
        // 给历史页面做导出时的标题
        chartDate: '监测时间',
        // 主键
        primaryKey: 'STCD',
        // 展示数据的键
        showKey: 'LE',
        // 时间的键
        dateKey: 'YMDHM',
        // 展示数据的键
        chartShowKey: 'LE',
        // 时间的键
        chartDateKey: 'YMDHM',
        // 图表标题
        chartTitle: '历史数据',
        // 图表点名称
        chartDataName: '水位（米）',
        // 要在历史tab中显示的组件id
        historyTabs: [
          'dataLineChart',
          'dataList'
          // 'picture'
        ]
      }
    }
  },
  // 列表格式
  tableFormat: [
    // 所属河流
    // 河流名称
    {
      // 显示标题
      label: '所属河流',
      // 属性键
      prop: 'RINM',
      // 宽度
      width: 80,
      // 是否需要搜索
      isSearch: true,
      // 格式化函数
      formatter: function (row, column, cellValue, index) {
        return cellValue
      }
    },
    // 站名
    {
      // 显示标题
      label: '站名',
      // 属性键
      prop: 'STNM',
      // 宽度
      width: 80,
      // 是否需要搜索
      isSearch: true,
      // 格式化函数
      formatter: function (row, column, cellValue, index) {
        return cellValue
      }
    },
    // 时间
    {
      label: '时间',
      prop: 'YMDHM',
      width: 120,
      isSearch: true,
      formatter: function (row, column, cellValue, index) {
        if (cellValue) {
          // 'q+': Math.floor((date.getMonth() + 3) / 3), //季度yyyy-MM-dd hh:mm:ss
          return new Date(cellValue).format('MM-dd hh:mm')
        }
        return ''
      }
    },
    // 实时水位
    {
      label: '实时水位(m)',
      prop: 'LE',
      width: 125,
      isSearch: true,
      formatter: function (row, column, cellValue, index) {
        if (row.LE === 0 || row.LE === '' || row.LE === undefined) {
          return '--'
        }
        return cellValue
      }
    },
    // 水位预警
    {
      label: '水位预警',
      prop: 'WLA',
      width: 100,
      isSearch: true,
      formatter: function (row, column, cellValue, index) {
        if (row.LE > row.GULE && row.GULE != null && row.GULE !== 0) {
          // 'q+': Math.floor((date.getMonth() + 3) / 3), //季度yyyy-MM-dd hh:mm:ss
          return `<img style='width:24px;' src='/static/img/yujing.svg'></img>`// 到达预警水位出现预警小图标
        }
        return `--`
      }
    },
    {
      label: '设防水位(m)',
      prop: 'FOLE',
      width: 125,
      isSearch: true,
      formatter: function (row, column, cellValue, index) {
        if (row.FOLE === 0 || row.FOLE === null || row.FOLE === undefined) {
          return '--'
        }
        return cellValue
      }
    },
    {
      label: '警戒水位(m)',
      prop: 'ALLE',
      width: 125,
      isSearch: true,
      formatter: function (row, column, cellValue, index) {
        if (row.ALLE === 0 || row.ALLE === null || row.ALLE === undefined) {
          return '--'
        }
        return cellValue
      }
    },
    {
      label: '保证水位(m)',
      prop: 'GULE',
      width: 125,
      isSearch: true,
      formatter: function (row, column, cellValue, index) {
        if (row.GULE === 0 || row.GULE === null || row.GULE === undefined) {
          return '--'
        }
        return cellValue
      }
    },
    // 水势
    {
      label: '水势',
      prop: 'WAPO',
      width: 100,
      isSearch: true,
      formatter: function (row, column, cellValue, index) {
        if (row.WAPO === '6') {
          return `<img style='width:20px;' src='/static/img/flat.svg'></img>`// 平
        } else if (row.WAPO === '5') {
          return `<img style='width:20px;' src='/static/img/down.svg'></img>`// 降
        } else if (row.WAPO === '4') {
          return `<img style='width:20px;' src='/static/img/up.svg'></img>`// 涨
        }
        return `--`
      }
    }
  ]
}
export default river
